<template>
  <div class="login">
    <div class="login-container">
      <div class="login-title__pic">{{title.registerTitle}}</div>
      <div class="login-content">
        <div class="login-content__right">

          <el-form ref="loginForm" :model="loginForm" :rules="rules" class="login-form">
            <div class="welcome-text">医师帐号注册</div>
            <el-row :gutter="20">
              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="regionName">
                  <div class="login-account1">
                    <el-input class="login-account" :disabled="true" v-model="this.loginForm.regionName"
                      :placeholder="this.loginForm.regionName" clearable size="small" style="margin-bottom: 20px"
                      placeholder="请选择机构所在的辖区">
                      <template #prefix>
                        <img src="@/assets/fronts/addr.png" class="login-account__icon1" />
                      </template>
                    </el-input>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="">
                  <div class="tree-container">
                    <el-tree class="scrollable-tree" :props="props" :load="loadNode" lazy node-key="code"
                      @node-click="handleNodeClick">
                    </el-tree>
                  </div>
                </el-form-item>
              </el-col>
              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="">
                  <el-input :disabled="true" class="login-account" type="text" v-model="loginForm.institutionName"
                    autocomplete="off" placeholder="请选择右边医师所在主职业机构">
                    <template #prefix>
                      <img src="@/assets/fronts/hos.png" class="login-account__icon1" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="">
                  <el-select @change="handleHos(selectData.id)" class="login-account" v-model="selectData.id"
                    placeholder="请选择机构">
                    <template slot="prefix">
                      <span style="padding: 5px; line-height: 33px; font-size: 18px; color: #409eff;">
                        <i class="el-icon-search"></i>
                      </span>
                    </template>
                    <el-option v-for="hospital in hosList" :key="hospital.uniqueCode" :label="hospital.institutionName"
                      :value="hospital.hospitalId">
                    </el-option>
                  </el-select>
                </el-form-item>
              </el-col>
              <el-col :span="12" :xs="24">
                <el-input v-if="this.loginForm.reCount==0" class="login-account" type="text" v-model="loginForm.name"
                  autocomplete="off" placeholder="请先查并在右侧选择要注册的医师,如未找到请在下方姓名栏填写">
                  <template #prefix>
                    <img src="@/assets/fronts/dname.png" class="login-account__icon2" />
                  </template>
                </el-input>
              </el-col>
              <el-col v-if="this.loginForm.reCount==0" :span="6" :xs="24">
                <el-select @change="handleDocOptionClick(selectDocData.id)" class="login-account"
                  v-model="selectDocData.id" placeholder="请选择医师">
                  <template slot="prefix">
                    <span style="padding: 5px; line-height: 33px; font-size: 18px; color: #409eff;">
                      <i class="el-icon-search"></i>
                    </span>
                  </template>
                  <el-option v-for="doc in docList" :key="doc.doctorCode" :label="doc.name" :value="doc.doctorCode">
                  </el-option>
                </el-select>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="idCard">
                  <el-input class="login-account" type="text" v-model="loginForm.idCard" autocomplete="off"
                    placeholder="请输入医师身份证号">
                    <template #prefix>
                      <img src="@/assets/fronts/idcard.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="shorName">
                  <el-input class="login-account" type="text" v-model="shotName" autocomplete="off"
                    placeholder="姓名栏,请在这里输入医师姓名">
                    <template #prefix>
                      <img src="@/assets/fronts/dname.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>



              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="mobile">
                  <el-input class="login-account" type="text" v-model="loginForm.mobile" autocomplete="off"
                    placeholder="请输入手机号">
                    <template #prefix>
                      <img src="@/assets/fronts/phone.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>


              <el-col :span="6" :xs="24">
                <el-form-item class="login-account" label="" prop="sex">
                  <el-select v-model="loginForm.sex" placeholder="请选择医师性别" :style="{width: '100%'}">
                    <el-option-group>
                      <el-option label="男" value="1" />
                      <el-option label="女" value="2" />
                    </el-option-group>
                    <template #prefix>
                      <img src="@/assets/fronts/gender.png" class="login-account__icon2" />
                    </template>
                  </el-select>
                </el-form-item>
              </el-col>


              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="birthday">
                  <el-date-picker class="login-account" v-model="loginForm.birthday" type="date" placeholder="请选择出生日期"
                    format="yyyy-MM-dd" :picker-options="pickerOptions">
                    <template #prefix>
                      <img src="@/assets/fronts/birthday.png" class="login-account__icon2" />
                    </template>
                  </el-date-picker>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="specialty">
                  <el-input class="login-account" type="text" v-model="loginForm.specialty" autocomplete="off"
                    placeholder="请输入院校及专业">
                    <template #prefix>
                      <img src="@/assets/fronts/school.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="antecedent">
                  <el-input class="login-account" type="text" v-model="loginForm.antecedent" autocomplete="off"
                    placeholder="医师学历">
                    <template #prefix>
                      <img src="@/assets/fronts/specialty.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item class="login-account" label="" prop="technicalTitle">
                  <el-select v-model="loginForm.technicalTitle" placeholder="请选择医师职称" :style="{width: '100%'}">
                    <el-option-group>
                      <el-option label="无职称" value="0" />
                      <el-option label="主任医师" value="1" />
                      <el-option label="副主任医师" value="2" />
                      <el-option label="主治医师" value="3" />
                      <el-option label="医师" value="4" />
                      <el-option label="助理医师" value="5" />
                      <el-option label="理疗师" value="6" />
                    </el-option-group>
                    <template #prefix>
                      <img src="@/assets/fronts/technicalTitle.png" class="login-account__icon2" />
                    </template>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="doctorLicence">
                  <el-input class="login-account" type="text" v-model="loginForm.doctorLicence" autocomplete="off"
                    placeholder="请输入医师执业证书编号">
                    <template #prefix>
                      <img src="@/assets/fronts/licence.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="qualification">
                  <el-input class="login-account" type="text" v-model="loginForm.qualification" autocomplete="off"
                    placeholder="请输入医师资格证书编号">
                    <template #prefix>
                      <img src="@/assets/fronts/qualification.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item class="login-account" label="" prop="antibiosisAuthority">
                  <el-select v-model="loginForm.antibiosisAuthority" placeholder="请选择抗菌药物处方权" :style="{width: '100%'}">
                    <el-option-group>
                      <el-option label="无抗菌药物处方权" value="0" />
                      <el-option label="非限制级" value="1" />
                      <el-option label="限制级" value="2" />
                      <el-option label="特殊级" value="3" />
                    </el-option-group>
                    <template #prefix>
                      <img src="@/assets/fronts/antibiosisAuthority.png" class="login-account__icon2" />
                    </template>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item class="login-account" label="" prop="anestheticAuthority">
                  <el-select v-model="loginForm.anestheticAuthority" placeholder="请选择有无精麻类药物处方权"
                    :style="{width: '100%'}">
                    <el-option-group>
                      <el-option label="无精麻类药物处方权" value="0" />
                      <el-option label="有精麻类药物处方权" value="1" />
                    </el-option-group>
                    <template #prefix>
                      <img src="@/assets/fronts/anesthetic.png" class="login-account__icon2" />
                    </template>
                  </el-select>
                </el-form-item>
              </el-col>

              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="username">
                  <el-input class="login-account" type="text" v-model="loginForm.username" autocomplete="off"
                    placeholder="注册的用户名">
                    <template #prefix>
                      <img src="@/assets/fronts/user.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>
              <el-col :span="6" :xs="24">
                <el-form-item label="" prop="password">
                  <el-input class="login-account" type="text" v-model="loginForm.password" autocomplete="off"
                    placeholder="注册的密码">
                    <template #prefix>
                      <img src="@/assets/fronts/pwd.png" class="login-account__icon2" />
                    </template>
                  </el-input>
                </el-form-item>
              </el-col>

              <el-col :span="12" :xs="24">
                <el-form-item label="" prop="">
                  <div class="login-submit" @click="handleLogin">
                    <span v-if="!loading">点击注册医师</span>
                    <span v-else>注 册 中...</span>
                    <i class="el-icon-right"></i>
                  </div>
                </el-form-item>
              </el-col>
            </el-row>
            <!-- <div class="flex-1"></div> -->

          </el-form>
        </div>
      </div>
      <!--      <p class="archival-information">沪ICP备15050430号-1ICP 证沪B2-20180118 沪公网安备 31011502008153号</p>-->
    </div>
  </div>
</template>

<script>
  import {
    getCodeImg,
    registerHos,
    registerDoctor,
    registerNurse,
    getRegionList,
    getHosListBySig,
    getDocListBySig,
    checkHosSameName,
    checkDocSameName,
    checkNurSameName,
    registerTitle
  } from "@/api/login";
  import Cookies from "js-cookie";
  import {
    encrypt,
    decrypt
  } from '@/utils/jsencrypt'
  import {
    listProvince1,
    listCity1,
    listArea1,
    listStreet1,
    listVillage1
  } from "@/api/his/province";
  import {
    treeselect
  } from "@/api/system/dept";
  import Treeselect from "@riophae/vue-treeselect";
  import "@riophae/vue-treeselect/dist/vue-treeselect.css";
  export default {
    name: "Login",
    data() {
      return {
        shorName: null,
        title: {
          registerTitle: ''
        },
        docList: [], //存储医生
        selectDocData: {
          id: ''
        },
        selectData: {
          id: ''
        },
        pickerOptions: {
          disabledDate(time) {
            // 获取当前日期的时间戳
            const now = Date.now();
            // 将选择的日期转换为时间戳
            const selectedTime = new Date(time).getTime();
            // 如果选择的日期大于当前日期，则禁用
            return selectedTime > now;
          }
        },
        loading: false,
        hosList: [], //存储医院
        props: {
          label: 'name',
          children: 'zones',
          isLeaf: 'leaf'
        },
        shotName: null,
        loginForm: {
          reCount: null, //>0表示名称无重复选项
          doctorCode: null,
          provinceCode: '', //省
          cityCode: '', //市
          areaCode: '', //区
          streetCode: '', //镇
          regionCode: '', //选中的区域码
          regionName: '', //选中的区域名称
          username: '', //用户名
          password: '', //密码
          institutionName: '', //医院名称
          name: '', //医生姓名
          sex: '', //医生性别
          birthday: '', //生日
          idCard: '', //身份证号
          mobile: '', //手机号
          antecedent: '', //学历
          specialty: '', //所学专业
          doctorLicence: '', //执业证书编码
          hospitalId: '', //医院ID
          signature: '', //签名
          antibiosisAuthority: '', //抗菌药物处方权默认为 0， 0:无抗菌药物处方权 1:非限制级 2:限制级 3:特殊级
          anestheticAuthority: '', //麻醉药品和第一类精神药品处方资 格默认为 0， 0:无 1:有
          technicalTitle: '', //职称 01 主任医师 02 副主任医师 03 主治医师 04 医师 05 助理医师 06 理疗师
          qualification: '' //资格证编号
        },
        //-------------------
        // 表单校验
        // 表单校验
        rules: {
          regionCode: [{
            required: true,
            message: "请选择辖区",
            trigger: "blur"
          }],
          institutionName: [{
            required: true,
            message: "机构名称不能为空",
            trigger: "blur"
          }],
          // name: [{
          // 	required: true,
          // 	message: "医师姓名不能为空",
          // 	trigger: "blur"
          // }],
          mobile: [{
              required: true,
              message: "手机号码不能为空",
              trigger: "blur"
            },
            {
              pattern: /^1[3|4|5|6|7|8|9][0-9]\d{8}$/,
              message: "请输入正确的手机号码",
              trigger: "blur"
            }
          ],
          idCard: [{
              required: true,
              message: "医师身份证号不能为空",
              trigger: "blur"
            },
            {
              pattern: /^(^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$)|(^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])((\d{4})|\d{3}[Xx])$)$/,
              message: "请输入正确的身份证号码",
              trigger: "blur"
            }
          ],
          sex: [{
            required: true,
            message: "请选择医师性别",
            trigger: "blur"
          }],
          birthday: [{
            required: true,
            message: "请选择出生日期",
            trigger: "blur"
          }],
          antecedent: [{
            required: true,
            message: "医师学历不能为空",
            trigger: "blur"
          }],
          specialty: [{
            required: true,
            message: "医师院校和专业不能为空",
            trigger: "blur"
          }],
          doctorLicence: [{
            required: true,
            message: "医师执业证书不能为空",
            trigger: "blur"
          }],
          technicalTitle: [{
            required: true,
            message: "请选择医师职称",
            trigger: "blur"
          }],
          qualification: [{
            required: true,
            message: "医师资格证书不能为空",
            trigger: "blur"
          }],
          antibiosisAuthority: [{
            required: true,
            message: "请选择医师抗菌处方权",
            trigger: "blur"
          }],
          anestheticAuthority: [{
            required: true,
            message: "请选择医师有无精麻处方权",
            trigger: "blur"
          }],
          username: [{
            required: true,
            message: "用户昵称不能为空",
            trigger: "blur"
          }],
          password: [{
            required: true,
            message: "用户密码不能为空",
            trigger: "blur"
          }]
        }
        //-------------------
      }

    },
    watch: {
      $route: {
        handler: function(route) {
          this.redirect = route.query && route.query.redirect;
        },
        immediate: true
      },

      'loginForm.institutionName': {
        handler(newValue) {
          this.searchHandler(newValue);
        },
        immediate: true
      },
      'loginForm.name': {
        handler(newValue) {
          this.searchDocHandler(newValue);
        },
        immediate: true
      }
    },

    created() {
      this.loginForm.signature = this.$route.query.signature
      this.checkDocSameName()
      this.getHosList();
      this.getProvince();
      this.getDocList();
      this.getTitle();
    },
    methods: {
      getTitle() {
        registerTitle({
          signature: this.loginForm.signature
        }).then(res => {
          this.title.registerTitle = res.data.registerTitle;
        }).catch(error => {
          // 处理获取标题信息时的错误
          console.error('获取标题信息失败:', error);
        }).finally(() => {
          // 无论请求是否成功都执行的代码块
          if (this.title.registerTitle === undefined || this.title.registerTitle === '') {
            this.title.registerTitle = '遵义市汇川区信息化卫生监督体系平台';
          }
        });
      },
      //查看有无重复姓名的医生
      checkDocSameName() {
        checkDocSameName({
          signature: this.loginForm.signature
        }).then(response => {
          // alert(JSON.stringify(response) )
          this.loginForm.reCount = response
        }).catch(error => {
          console.error('获取信息出错:', error);
        });
      },
      // 节点单击事件
      handleNodeClick(node) {
        // alert(node.code.length)
        if (node.code.length == 2) {
          this.loginForm.provinceCode = node.code
        } else if (node.code.length == 4) {
          this.loginForm.cityCode = node.code
        } else if (node.code.length == 6) {
          this.loginForm.areaCode = node.code
        }
        if (node.code.length == 9) {
          this.loginForm.streetCode = node.code
        }
        this.loginForm.regionCode = node.code
        this.loginForm.regionName = node.name
        // alert(JSON.stringify(this.loginForm))
      },
      //医院
      handleHos(hospitalId) {
        for (let hos of this.hosList) {
          if (hospitalId === hos.hospitalId) {
            this.loginForm.institutionName = hos.institutionName
            this.loginForm.hospitalId = hos.hospitalId
            break; // 找到匹配项后跳出循环
          }
        }
      },
      //医生
      getDocList() {
        getDocListBySig({
          signature: this.loginForm.signature
        }).then(response => {
          this.docList = response;
        }).catch(error => {
          console.error('获取医生列表出错:', error);
        });
      },
      handleDocOptionClick(doctorCode) {
        for (let doc of this.docList) {
          if (doctorCode === doc.doctorCode) {
            // 可以在这里进行其他操作，例如将匹配的医院赋值给 selectedHospital
            this.loginForm.name = doc.name;
            this.loginForm.doctorCode = doctorCode
            break; // 找到匹配项后跳出循环
          }
        }
        // this.loginForm.hospitalId = hospitalId;
      },
      //医生触发器
      searchDocHandler(newValue) {
        // 触发搜索操作
        const keyword = newValue.toLowerCase();
        for (let doc of this.docList) {
          if (doc.name.toLowerCase().includes(keyword)) {
            // 可以在这里进行其他操作，例如将匹配的医院赋值给 selectedHospital
            this.selectDocData.id = doc.name;

            break; // 找到匹配项后跳出循环
          }
        }
      },
      //医院触发器
      searchHandler(newValue) {
        // 医院触发搜索操作
        const keyword = newValue.toLowerCase();
        for (let hos of this.hosList) {
          if (hos.institutionName.toLowerCase().includes(keyword)) {
            this.selectData.id = hos.institutionName;

            break; // 找到匹配项后跳出循环
          }
        }
      },
      //根据signature！=null 去获取医院
      getHosList() {
        getHosListBySig({
          signature: this.loginForm.signature
        }).then(response => {
          this.hosList = response;
        }).catch(error => {
          console.error('获取医院列表出错:', error);
        });
      },

      loadNode(node, resolve) {
        // 根据节点的层级来判断加载数据
        if (node.level === 0) {
          // 当节点层级为 0 时，即根节点，返回第一级的数据（省份数据）
          this.getProvince().then(response => {
            // 将获取到的省份数据转换成级联选择器的节点数据格式
            const data = response.map(province => {
              return {
                name: province.name,
                code: province.code,
                parentName: province.name,
                isLeaf: false // 省份节点设置为非叶子节点
              };
            });
            resolve(data);
          }).catch(error => {
            console.error('Failed to load province data:', error);
            resolve([]); // 加载失败时返回空数组
          });
        } else if (node.level === 1) {
          // 当节点层级为 1 时，即省份节点，根据省份 code 获取对应的市数据
          const provinceCode = node.data.code;
          this.getCity(provinceCode).then(response => {
            // 将获取到的市数据转换成级联选择器的节点数据格式
            const data = response.map(city => {
              return {
                name: city.name,
                code: city.code,
                parentName: node.data.parentName + "/" + city.name,
                isLeaf: false // 市节点设置为非叶子节点
              };
            });
            resolve(data);
          }).catch(error => {
            console.error('Failed to load city data:', error);
            resolve([]); // 加载失败时返回空数组
          });
        } else if (node.level === 2) {
          // 当节点层级为 2 时，即市级节点，根据市 code 获取对应的县/区数据
          const cityCode = node.data.code;
          this.getArea(cityCode).then(response => {
            // 将获取到的县/区数据转换成级联选择器的节点数据格式
            const data = response.map(district => {
              return {
                name: district.name,
                code: district.code,
                parentName: node.data.parentName + "/" + district.name,
                isLeaf: false // 县/区节点设置为非叶子节点
              };
            });
            resolve(data);
          }).catch(error => {
            console.error('Failed to load district data:', error);
            resolve([]); // 加载失败时返回空数组
          });
        } else if (node.level === 3) {
          // 当节点层级为 3 时，即县/区节点，根据县/区 code 获取对应的镇/街道数据
          const areaCode = node.data.code;
          this.getStreet(areaCode).then(response => {
            // 将获取到的镇/街道数据转换成级联选择器的节点数据格式
            const data = response.map(street => {
              return {
                name: street.name,
                code: street.code,
                parentName: node.data.parentName + "/" + street.name,
                isLeaf: false // 镇/街道节点设置为非叶子节点
              };
            });
            resolve(data);
          }).catch(error => {
            console.error('Failed to load street data:', error);
            resolve([]); // 加载失败时返回空数组
          });
        } else {
          // 其他层级的节点直接返回空数组
          resolve([]);
        }
      },

      /** 查询国家机构列表 */
      getProvince() {
        return new Promise((resolve, reject) => {
          // 调用 API 获取省份数据
          listProvince1().then(response => {
            resolve(response);
          }).catch(error => {
            reject(error);
          });
        });
      },

      /** 查询市级列表 */
      getCity(provinceCode) {
        return new Promise((resolve, reject) => {
          // 调用 API 根据省份 code 获取对应的市数据
          listCity1({
            provinceCode: provinceCode
          }).then(response => {
            resolve(response);
          }).catch(error => {
            reject(error);
          });
        });
      },

      /** 查询县/区级列表 */
      getArea(cityCode) {
        return new Promise((resolve, reject) => {
          // 调用 API 根据市 code 获取对应的县/区数据
          listArea1({
            cityCode: cityCode
          }).then(response => {
            resolve(response);
          }).catch(error => {
            reject(error);
          });
        });
      },

      /** 查询镇/街道级列表 */
      getStreet(areaCode) {
        return new Promise((resolve, reject) => {
          // 调用 API 根据县/区 code 获取对应的镇/街道数据
          listStreet1({
            areaCode: areaCode
          }).then(response => {
            resolve(response);
          }).catch(error => {
            reject(error);
          });
        });
      },
      // 筛选节点
      filterNode(value, data) {
        if (!value) return true;
        return data.label.indexOf(value) !== -1;
      },
      getCode() {
        getCodeImg().then(res => {
          this.captchaOnOff = res.captchaOnOff === undefined ? true : res.captchaOnOff;
          if (this.captchaOnOff) {
            this.codeUrl = "data:image/gif;base64," + res.img;
            this.loginForm.uuid = res.uuid;
          }
        });
      },
      handleLogin() {
        this.$refs["loginForm"].validate(valid => {
          if (valid) {
            // alert(JSON.stringify(this.loginForm))
            this.loading = true;
            if (this.shorName !== "" && this.loginForm.name === "") {
              this.loginForm.name = this.shotName
            }
            if (this.loginForm.streetCode !== null && this.loginForm.streetCode !== '') {

              console.log(JSON.stringify(this.loginForm))
              // 调用注册方法
              registerDoctor(this.loginForm)
                .then(response => {
                  // 注册成功后的处理逻辑
                  this.$modal.msgSuccess("注册成功");
                  // 在这里可以进行其他操作，例如跳转页面等
                  this.reLoginForm();
                })
                .catch(error => {
                  // 注册失败的处理逻辑
                  this.$modal.msgError("注册失败，请重试");
                })
                .finally(() => {
                  this.loading = false;
                });
            } else {
              alert("辖区请选择到街道或者镇！")
            }
          }
        });
      },
      reLoginForm() {
        this.shotName = null;
        this.loginForm = {

          username: '', //用户名
          password: '', //密码
          institutionName: '', //医院名称
          name: '', //医生姓名
          sex: '', //医生性别
          birthday: '', //生日
          idCard: '', //身份证号
          mobile: '', //手机号
          antecedent: '', //学历
          specialty: '', //所学专业
          doctorLicence: '', //执业证书编码
          hospitalId: '', //医院ID
          antibiosisAuthority: '', //抗菌药物处方权默认为 0， 0:无抗菌药物处方权 1:非限制级 2:限制级 3:特殊级
          anestheticAuthority: '', //麻醉药品和第一类精神药品处方资 格默认为 0， 0:无 1:有
          technicalTitle: '', //职称 01 主任医师 02 副主任医师 03 主治医师 04 医师 05 助理医师 06 理疗师
          qualification: '' //资格证编号
        }
      }
    }
  }
</script>




<style rel="stylesheet/scss" lang="scss" scoped>
  .tree-container {
    height: 100px;
    /* 设置容器的高度 */
    overflow-y: auto;
    /* 添加垂直滚动条 */
  }

  .login-form {
    display: flex;
    flex-direction: column;
    height: 100%;
  }

  .flex-1 {
    flex: 1;
  }

  .login {
    width: 100%;
    min-width: 1200px;
    height: 100%;
    background-image: url("~@/assets/images/login/login-background.png");
    display: flex;
    justify-content: center;
    align-items: center;
    position: relative;

    .login-container {
      position: relative;
      width: 1189px;
      height: 639px;
      background-color: #fff;

      .login-title__pic {
        position: absolute;
        top: 0;
        left: 0;
        width: 494px;
        height: 64px;
        background-image: url("~@/assets/images/login/login-title.png");
        background-repeat: no-repeat;
        color: #FCFDFF;
        font-weight: bold;
        font-size: 25px;
        line-height: 60px;
        padding-left: 22px;

      }

      .login-content {
        display: flex;
        margin-top: 24px;
        padding: 57px 92px 116px 72px;
        width: 100%;
        height: calc(100% - 24px);
        background-image: url("~@/assets/images/login/login-content-bg.png");
        background-position: left bottom;
        background-repeat: no-repeat;

        &__left {
          // background-color: pink;
          width: 551+474px;
          height: 391px;
          flex: 1;
          // background-image: url("~@/assets/images/login/login-left.png");
        }

        &__right {
          width: 1025px;
          height: 391px;
          padding-left: 49px;
          display: flex;
          flex-direction: column;

          .welcome-text {
            color: #3B3B3B;
            font-weight: bold;
            font-size: 26px;
            line-height: 48px;
            user-select: none;
            margin-top: -10px;
            margin-bottom: 10px;
          }

          .login-account {
            margin-top: 20px;

            &__icon {
              background-image: url("~@/assets/images/login/account.png");
            }
          }

          .login-password {
            margin-top: 20px;

            &__icon {
              background-image: url("~@/assets/images/login/lock.png");
              background-repeat: no-repeat;
            }
          }

          .login-account,
          .login-password {
            ::v-deep .el-input__inner {
              display: block;
              height: 45px;
              font-size: 14px;
              padding-left: 51px;
            }

            ::v-deep .el-input__prefix {
              display: flex;
              align-items: center;
              justify-content: flex-start;
              width: 51px;
              height: 100%;
              padding-left: 16px;

              .login-account__icon1 {
                width: 80%;
              }

              .login-account__icon2 {
                width: 65%;
              }

              .login-account__icon,
              .login-password__icon {
                width: 24px;
                height: 22px;
              }

            }
          }

          .login-submit {
            margin-top: 15px;
            display: flex;
            justify-content: space-between;
            align-items: center;
            height: 45px;
            background-color: #4373F1;
            color: #fff;
            line-height: 45px;
            border-radius: 5px;
            padding-left: 27px;
            padding-right: 21px;
            font-size: 16px;
            font-weight: bold;
            cursor: pointer;
            user-select: none;

            .el-icon-right {
              font-size: 22px;
            }
          }
        }
      }

      .archival-information {
        position: absolute;
        bottom: -53px;
        left: 50%;
        transform: translateX(-50%);
        color: #6B6B6B;
        margin: 0;
        font-size: 14px;
        font-weight: 500;
      }
    }
  }

  .flex-1 {
    flex: 1;
  }

  .el-form-item {
    margin-bottom: 0px;
  }
</style>
